import React, { Component } from 'react';
import { StyledBtn } from "./StyledCategory";
class Mytypes extends Component {
  state={
    type:'category',//category代表分类 material代表食材
    // type:'material',
  }
  hander=(str)=>{
    this.setState({
      type:str
    },()=>{
      // console.log(this.state.type);
    })
    this.props.changeBtn(str)
  }
  render() {
    return (
      <StyledBtn>
        <ul>
          <li onClick={()=>this.hander('category')}>分类</li>
          <li onClick={()=>this.hander('material')}>食材</li>
          <li className={this.state.type=='category'?'cover':'cover coverright'}>{this.state.type=='category'?'分类':'食材'}</li>
        </ul>
      </StyledBtn>
    );
  }
}

export default Mytypes;
